av中文字幕网免费观看_制服丝袜人妻无码每日更新_国产成人午夜福利免费无码r_国产在线观看一级二级三级

 
技術(shù)博客INFO
聯(lián)系我們CONTACT

公司地址:茂名市人民南路新村大院22號101

電話:13592986386

VUE 的一些常用外部組件學習日志您當前的位置:首頁 > VUE 的一些常用外部組件學習日志

VUE 的一些常用外部組件學習日志

發(fā)布時間:2024/9/5 15:52:50


echarts  采用畫圖


Vue.js(讀音 /vjuː/, 類似于 view) 是一套構(gòu)建用戶界面的漸進式框架。
Vue 只關(guān)注視圖層, 采用自底向上增量開發(fā)的設計。
Vue 的目標是通過盡可能簡單的 API 實現(xiàn)響應的數(shù)據(jù)綁定和組合的視圖組件。
Vue 學習起來非常簡單,本教程基于 Vue 2.1.8 版本測試,Vue3 請參閱 Vue3 教程。
<div id="app">
    <p v-if="seen">現(xiàn)在你看到我了</p>
    <template v-if="ok">
      <h1>菜鳥教程</h1>
      <p>學的不僅是技術(shù),更是夢想!</p>
      <p>哈哈哈,打字辛苦。。!</p>
    </template>
</div>
    
<script>
new Vue({
  el: '#app',
  data: {
    seen: true,
    ok: true
  }
})
</script>






<div id="app">
  <ol>
    <li v-for="site in sites">
      {{ site.name }}
    </li>
  </ol>
</div>
 
<script>
new Vue({
  el: '#app',
  data: {
    sites: [
      { name: 'Runoob' },
      { name: 'Google' },
      { name: 'Taobao' }
    ]
  }
})
</script>


 GoJS 圖形實例
GoJS是一個用于創(chuàng)建交互式可視化圖表和圖形的JavaScript庫。它提供了豐富的功能和工具,使開發(fā)人員能夠輕松地構(gòu)建各種類型的圖表,包括流程圖、組織結(jié)構(gòu)圖、網(wǎng)絡拓撲圖等。GoJS具有靈活的布局和樣式設置,可以通過簡單的API來實現(xiàn)圖表的創(chuàng)建和操作。




vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,適合用于構(gòu)建單頁面應用。
vue的單頁面應用是基于路由和組件的,路由用于設定訪問路徑
router.map({
'/home': { component: Home },
'/about': { component: About }
})




SweetAlert2是一款功能強大的純Js模態(tài)消息對話框插件。SweetAlert2用于替代瀏覽器默認的彈出對話框,它提供各種參數(shù)和方法,支持嵌入圖片,背景,HTML標簽等,SweetAlert2是SweetAlert-js的升級版本,它解決了SweetAlert-js中不能嵌入HTML標簽的問題,并對彈出對話框進行了優(yōu)化,同時提供對各種表單元素的支持,還增加了5種情景模式的模態(tài)對話框,功能非常強大
 Swal('hello world')


swal({
            title: '提示',
            text: "早上好",
            confirmButtonText: '確認',
            confirmButtonColor: 'Green',
        })


 swal({
            title: '確定?',
            text: '您將無法恢復此文件!',
            type: '警告',
            showCancelButton: true,
            confirmButtonText: '確定,刪除',
            cancelButtonText: '取消',
        }).then(function(isConfirm) {
            if (isConfirm.value) {
                swal(
                        '已刪除!',
                        '文件已刪除',
                        'success'
                );
            }
        });